<!DOCTYPE html>
<html lang="en" style="height: 100%;">

<head>
	<meta charset="UTF-8">
	<meta name="viewport"
		content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
	<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
	<title>手机快速注册</title>
	<link rel="stylesheet" type="text/css" href="../../css/api.css" />
	<link rel="stylesheet" type="text/css" href="../../css/style.css" />
	<link rel="stylesheet" type="text/css" href="../../css/yzl.css" />
	<style>
		.input-center {
			margin: 0 auto;
			/*height: 60px;*/
			width: 100%;
			line-height: 50px;
		}

		input {
			/*line-height: 60px;*/
			outline: none;
			border-radius: 5px;
		}


		.register-btn {
			background: #33375E;
		}

		.input-center input {
			border: none;
		}

		.aui-checkbox {
			width: 16px;
			height: 16px;
			vertical-align: middle;
		}

		.v-enter,
		.v-leave-to {
			opacity: 0;
		}

		.v-enter-active,
		.v-leave-active {
			transition: opacity 1.5s;

		}
		.saoma{
			position: absolute;
			width:84px;
			height: 30px;
			/*margin-top: -25px;*/
			text-align: center;
			top:8px;
			line-height: 30px;
			color: #F95656;
			border-radius:  15px;
			border:1px solid #F95656;
			font-size: 12px;
			right:0px
		}
	</style>
</head>

<body style="background:#ffffff">
	<div id="blank" class="header" v-cloak>
		<div v-back.tapmode class="back"></div>
		<div class="title">注册</div>
	</div>
	<div id="app" v-cloak >
		<div style="width:100%;padding: 0 5%;padding-top:80px;box-sizing: border-box;">
			<div class="regis-head" style="margin-bottom:30px;">
				<img :src="authinfo.headimgurl"/>
				<div  class="regis-head-xinxi">
					<div style="font-size: 18px;font-weight: bold;margin-bottom: 15px;">{{authinfo.nickname}}</div>
					<div style="font-size: 12px;color: #999">注册授权微信号</div>
				</div>
			</div>
			<div style="text-align:center;margin-bottom:30px">已向{{pageParam.phone}}发送了一条验证码</div>
			<div class="input-center input-text">
				<input class="input" type="tel"  maxlength="6" placeholder="请输入短信验证码"  v-model="verify_code" />
			</div>
			<div class="input-center" v-show="is_need_code">
				<input class="input" type="text" v-model="invite_code"  ref="text" placeholder="请输入邀请码"   required />
				<a  class="saoma" v-myclick="scanner"><img v-src="'../../image/saoma.png'" style="width:12px;vertical-align:middle;margin-right:3px;">扫码获取</a>
			</div>
			<div class="user-agreement">注册代表同意<a style="color:#28A5DF">用户协议、隐私政策</a></div>
			<div v-myclick="registerPhone" class="regrist-button" :class="{'regrist-button-active':verify_code}">同意协议并注册</div>
		</div>
	</div>
</body>
	<script src="../../script/api.js"></script>
	<script src="../../script/vue.js"></script>
	<script src="../../script/app.js"></script>
	<script src="../../script/common.js"></script>
	<script src="../../script/url.js"></script>
	<script src="../../script/components.js"></script>

	<script>

		var pageParam,
				phone,
				vm;
		var talkingData;
		apiready = function () {
			setBSImg();
			new Vue({
				el: '#blank',
			});
			wap_url = getPrefs("wap_url");
			pageParam = api.pageParam.params;
			console.log(JSON.stringify(pageParam))
			initApp();
			api.parseTapmode();
			addListeners();
		};

		function initApp() {
			var isBigImg = Vue.BSImg == 'big';
			vm = new Vue({
				el: '#app',
				data: {
					authinfo: pageParam,
					phone:phone,
					stamp:'',
					verify_code: '',
					invite_code: '',
					is_need_code:pageParam.islogin==1?false:true
				},
				methods: {
					clearMessage: function() {

					},
					scanner:function(){
					FNScanner = api.require('FNScanner');
					FNScanner.open({
							autorotation: true
					}, function(ret, err) {
							if (ret) {
								url = ret.content;

								if(url){
									var code = getUrlKey('inviteCode',url);
									vm.invite_code = code;
								}
							} else {
									alert(JSON.stringify(err));
							}
					});
				},
					codeMessage: function (message) {
						this.warn_box = true
						this.warn_title1 = '请输入正确的手机号'
					},
					pwdlogin: function () {
						openWin('../login/pwdLogin', { phone: vm.phone });
						vm.clearMessage()
					},
					userAgreement: function () {
						var url = this.wap_url + 'home/agreement';
						openWin('../home/browser', { url: url });
					},
					registerPhone: function () {
						var data = {
							deviceId: api.deviceId,
							version: '1.0.1',
							smsVerification: this.verify_code,
							wxName: pageParam.nickname,
							sex: pageParam.sex,
							memberAdd: pageParam.headimgurl,
							phone: pageParam.phone,
							owner:0,
							memberType:0,
							registerType:3,
							wxUnionid:pageParam.unionid,
							wxOpenid:pageParam.openid,
							inviteCode: this.invite_code?this.invite_code:'',
							timeStamp:pageParam.timeStamp
						}
						var callback = function (ret) {
							setPrefs('openid', pageParam.openid);
							vm.login_init(ret.content);
						};
						var errback = function (err) {
							alert(err.message)
						}
						pinet.post(APIURLP+'/play/register/userInfo', data, callback, errback);
					},
					tologin:function(){
						closeWin()
					},
					login_init: function (user) {
						setPrefs('user', user);
						setPrefs('token', user.token);
						setPrefs('username', user.nickname);
						setPrefs('portrait', user.memberAdd);
						setPrefs('member_id', user.memberId);
						api.closeWin({
						    name: 'index'
						});

						api.openWin({
						    name: 'index',
						    url: '../../index.html',
								reload: true
						});

					},
				},
				watch: {

				}
			})
		}
		function addListeners() {
			// api.addEventListener({
			// 	name: 'viewdisappear'
			// }, function (ret, err) {
			// 	closeWin('setInfo');
			// });
		}

	</script>
</body>

</html>
